<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="ctx" value="${pageContext.request.contextPath }"></c:set>
<!DOCTYPE html>
<html lang="en">
<head>
<title>首页</title>
<meta charset="utf-8">
<link href="${ctx}/css/framework/bootstrap.min.css" rel="stylesheet">
<style type="text/css">
.content {
	width: 100%;
	height: 300px;
}
</style>
<link rel="stylesheet" type="text/css" href="${ctx }/css/index.css">


</head>
<body>
	<c:import url="nav.jsp"></c:import>
	<div class="container">
		<ol class="breadcrumb">
			<li><a href="${ctx}/toHome">首页</a></li>
			<li class="active">个人中心</li>
		</ol>

		<div class="row">
			<div class="col-md-3">
				<div class="panel panel-default">
					<div class="panel-heading">

						<c:if test="${empty(user.head_photo) }">
							<img src="${ctx }/images/defaulthead.png"
								class="img-responsive img-rounded" alt="Responsive image">
						</c:if>
						<c:if test="${!empty(user.head_photo) }">
							<img src="${user.head_photo}" class="img-responsive img-rounded"
								alt="Responsive image">
						</c:if>
						<h4>${user.user_name }</h4>
					</div>
				</div>

				<ul class="nav nav-sidebar">
					<li class="active"><a href="${ctx }/user/myzoom.html">个人信息
							<span class="sr-only">(current)</span>
					</a></li>
					<li><a href="${ctx }/user/myMatch.html">我的赛事</a></li>
					<li><a href="${ctx }/user_star.html">赛事获奖</a></li>
					<li><a href="#">Application</a></li>
				</ul>
			</div>

			<div class="col-md-9 divline">

				<h3>我参与的赛事</h3>

				<c:forEach var="sign" items="${signList}">
					<div class="col-md-4  ">
						<div class="panel panel-default">
							<div class="panel-heading">
								<a class="con"
									href="${ctx }/match.html?match_id=${sign.match.match_id}"><img
									src="${sign.match.cover}" width="224" height="170"></a>
							</div>
							<div class="panel-body">
								<h3 class="panel-title">${sign.match.match_name}</h3>
								<div class="main_btn">
									<button class="btn btn-primary btn-block upload"
										name="${sign.match.match_id}" data-toggle="modal"
										data-target="#myModal">
										<c:if test="${sign.isUpload eq 0}">点击上传报名表</c:if>
										<c:if test="${sign.isUpload eq 1}">点击更改报名表</c:if>
									</button>
								</div>
							</div>

						</div>
					</div>
				</c:forEach>
			</div>
		</div>
	</div>

	<!-- 模态框（Modal） -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">请上传报名表</h4>
				</div>
				
				<div class="modal-body">
					<form id="uploadForm" enctype="multipart/form-data"
						class="form-inline" action="${ctx}/uploadUserSign" method="post">
						<div class="form-group">
							<input type="file" name="file" class="btn btn-default"> <input
								type="hidden" name="match_id" value="">
						</div>
						<button class="btn btn-default" id="uploadSign" type="submit">上传</button>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭
					</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal -->
	</div>
	<c:import url="footer.jsp"></c:import>
	<script src="${ctx }/js/jquery.min.js"></script>
	<script src="${ctx }/js/framework/bootstrap.min.js"></script>
	<script type="text/javascript">
		$(function() {
			$("button").filter(".upload").click(function() {
				var val = $(this).attr("name");
				$('#myModal').on('show.bs.modal', function() {
					$("input[type='hidden']").val(val);
				})
			});

		});
	</script>
</body>

</html>